<template>
  <a-modal
    :width="modalWidth"
    :visible="visible"
    :title="title"
    v-drag
    @ok="handleSubmit"
    @cancel="close"
    cancelText="关闭"
  >
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <!-- 搜索区域 -->
      <vxe-grid
        ref="vxeTable" id = "ZSelectEcardCompanyModalTable"
        :toolbarConfig="false"
        :checkbox-config="{trigger:'row'}"
        :radio-config="{trigger:'row'}"
        v-bind="options"
        v-on="listeners"
      >
      </vxe-grid>
    </div>
  </a-modal>
</template>

<script>
import { VxeTableMixin } from '@/mixins/VxeTableMixin'
export default {
  name: 'ZSelectEcardCompanyModal',
  mixins: [VxeTableMixin],
  props: {
    modalWidth: {
      type: Number
    },
    multi: {
      type: Boolean
    },
    title: {
      type: String,
      default: () => '选择公司'
    }
  },
  data() {
    return {
      queryParam: {},
      columns: [
        { type: this.multi ? 'checkbox' : 'radio', width: 60 },
        { type: 'seq', width: 40  },
        {title: '公司名称', field: 'companyName',width: 400},
      ],
      visible: false,
      //form: this.$form.createForm(this),
      url: {
        list: '/ecard/company/v1/list'
      },
      disableMixinCreated: true
    }
  },
  methods: {
    showModal() {
      this.visible = true
      this.loadData(1)
      //this.form.resetFields()
    },
    close() {
      this.visible = false
    },
    handleSubmit() {
      if (this.multi) {
        const selectionRows = this.$refs.vxeTable.getCheckboxRecords()
        const selectedRowKeys = []
        selectionRows.forEach(item => {
          selectedRowKeys.push(item.code)
        })
        this.$emit('ok', selectedRowKeys.join(), selectionRows)
        this.close()
      } else {
        const row = this.$refs.vxeTable.getRadioRecord()
        this.$emit('ok', row.code, row)
        this.close()
      }
    },
    modalFormOk() {
      this.loadData()
    }
  }
}
</script>
